<!DOCTYPE html>
<html>
    <head>
        <meta charset='utf-8' />
        <style>
            div.c1{
                width:400px;
                height:200px;
                border-width:1px 1px 200px 1px;
                border-style:solid;
                border-color:pink;
                margin:0 auto;
                border-radius:50%;
                position:relative;
            }
            div.c1::before{
                content:'';
                width:50px;
                height:50px;
                border:75px solid white;
                display:block;
                position:absolute;
                left:0px;top:50%;
                border-radius:50%;
                background-color:pink;
            }
            div.c1::after{
                content:'';
                width:50px;
                height:50px;
                border:75px solid pink;
                display:block;
                position:absolute;
                right:0px;top:50%;
                border-radius:50%;
                background-color:white;
            }
        </style>
    </head>
    <body>
           <h3>太极</h3>
           <div class='c1'></div>
         
    </body>
</html>